<!DOCTYPE html>
<html lang="en">

<head>
    @@include('meta.html')
    <title>官方公告</title>
</head>

<body class="hidden">
    @@include('header.html')
    <div class="y-main-content">
        <div class="y-location clearfix">
            <div class="left clearfix">
                <span class="left first-location">活动公告</span>
                <img src="images/icon/next.png" alt="" class="left location-ico">
                <span class="left on-location">官方公告</span>
            </div>
        </div>
        <div class="clearfix hidden">
            @@include('active-exchange.html')
            <div class="y-content-r">
                <div class="y-location-r clearfix">
                    <span class="fl">官方公告</span>
                    <div class="fr y-searchCoins y-active-searchBox">
                        <input type="text" placeholder="搜索" value="" class="fl y-input y-search-input">
                        <img src="images/icon/y-search.png" alt="" class="y-searchBar">
                    </div>
                </div>
                <div class="y-main-content-r">
                    <div class="y-scroll-height pb30">
                        <div class="y-active-slide hidden">
                            <div class="clearfix y-j_slide">
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/test.png" alt="">
                                    </div>
                                </div>
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/appleBtn.png" alt="">
                                    </div>
                                </div>
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/test.png" alt="">
                                    </div>
                                </div>
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/test.png" alt="">
                                    </div>
                                </div>
                            </div>
                            <div class="clearfix y-j_slide y_disvisible">
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/appleBtn.png" alt="">
                                    </div>
                                </div>
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/test.png" alt="">
                                    </div>
                                </div>
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/test.png" alt="">
                                    </div>
                                </div>
                                <div class="fl width25p">
                                    <div class="y-active-imgBox">
                                        <img src="/images/test.png" alt="">
                                    </div>
                                </div>
                            </div>
                            <div class="y-slide-pages">
                                <i class="y-slide-page y-pre-slide y-slide-on" ref="0"></i>
                                <i class="y-slide-page y-next-slide" ref="1"></i>
                            </div>
                        </div>
                        <ul class="y-active-ul">
                            <li class="y-active-li">
                                <a href="#" class="clearfix y-active-link">
                                    <span class="fl y-active-text">关于系统停服维护公告</span>
                                    <span class="fr y-active-time">2018/07/09 17:52:52</span>
                                </a>
                            </li>
                            <li class="y-active-li">
                                <a href="#" class="clearfix y-active-link">
                                    <span class="fl y-active-text">关于系统停服维护公告</span>
                                    <span class="fr y-active-time">2018/07/09 17:52:52</span>
                                </a>
                            </li>
                            <li class="y-active-li">
                                <a href="#" class="clearfix y-active-link">
                                    <span class="fl y-active-text">关于系统停服维护公告</span>
                                    <span class="fr y-active-time">2018/07/09 17:52:52</span>
                                </a>
                            </li>
                            <li class="y-active-li">
                                <a href="#" class="clearfix y-active-link">
                                    <span class="fl y-active-text">关于系统停服维护公告</span>
                                    <span class="fr y-active-time">2018/07/09 17:52:52</span>
                                </a>
                            </li>
                            <li class="y-active-li">
                                <a href="#" class="clearfix y-active-link">
                                    <span class="fl y-active-text">关于系统停服维护公告</span>
                                    <span class="fr y-active-time">2018/07/09 17:52:52</span>
                                </a>
                            </li>
                            <li class="y-active-li">
                                <a href="#" class="clearfix y-active-link">
                                    <span class="fl y-active-text">关于系统停服维护公告</span>
                                    <span class="fr y-active-time">2018/07/09 17:52:52</span>
                                </a>
                            </li>
                        </ul>
                        <div class="y-page"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @@include('footer-js.html')
    <script src="js/jquery.page.js"></script>
    <script type="text/javascript">
        $(function () {
            // 活动滚动图宽高比
            $('.y-active-imgBox img')[0].onload = function () {
                var _this = this;
                setTimeout(function () {
                    $('.y-active-imgBox,.y-active-slide').css('height', $(_this).width() * 8 / 17);
                }, 500);
            }
            $('.y-active-imgBox img').each(function () {
                $(this).load(function () {
                    $(this).css('margin-top', -$(this).height() / 2);
                });
            });
            $('.y-slide-page').click(function () {
                $('.y-slide-page').removeClass('y-slide-on');
                $(this).addClass('y-slide-on');
                $('.y-j_slide').addClass('y_disvisible');
                $('.y-j_slide').eq($(this).attr('ref')).removeClass('y_disvisible');
            });
            // 分页api
            $('.y-page').createPage(function (n) {
                console.log(n);
            }, {
                pageCount: 8,//总页码,默认10
                current: 2,//当前页码,默认1
                showPrev: true,//是否显示上一页按钮
                showNext: true,//是否显示下一页按钮
                showTurn: true,//是否显示跳转,默认可以
                showNear: 1,//显示当前页码前多少页和后多少页，默认2
                pageSwap: false,//是否同意调剂,默认是。调剂会最大数量显示页码。例如当前页面之前无页码可以显示。则会增加之后的页码。
                showSumNum: false,//是否显示总页码
            },{
                fontSize: 18,
                trunWidth: 250 //跳转模块宽度
            });

        })
    </script>
</body>

</html>